<template>
  <div>
    <!-- -->
    <button :style="{background:mytypeColor,width:mysize.w,height:mysize.h}">
        <slot></slot>
    </button>
  </div>
</template>

<script>
export default {
  name: '2209vueVanButton',
  props:["type","size"],
  data() {
    return {
      
    };
  },
  computed:{
    mytypeColor(){
      let str=''
      if(this.type=='primary'){
        str="blue"
      }else if(this.type=='success'){
        str="green"
      }else if(this.type=='danger'){
          str="red"
      }else if(this.type=='warning'){
         str="yellow"
      }
      return str
   },
   mysize(){
    let w="200px";
    let h="200px";
    if(this.size=="large"){
        w="100vw";
        h="300px"
    }
      if(this.size=="mini"){
        w="100px";
        h="100px"
     }
     return {
      w,h
     }
   },
  },
  mounted() {
    
  },

  methods: {
    
  },
};
</script>